<template>
  <div>
    <a-select
      :mode="multi==true?'multiple':'default'"
      style="width: 100%"
      placeholder="请选择平台账号"
      @deselect="deselect"
      v-model="ids"
      :open="open"
      :disabled="disabled"
      @dropdownVisibleChange="selectIds">
      <a-select-option v-for="item in selectedObj" :key="item.id">{{item.ptzhbm}}</a-select-option>
    </a-select>
    <select-platform-account-input-modal ref="inputModal" :dataType="dataType" :dataIsolation = "dataIsolation" :urlList="this.url.urlList" :multi="multi" @choseObj="choseObj"></select-platform-account-input-modal>
  </div>
</template>

<script>
import SelectPlatformAccountInputModal from './modules/SelectPlatformAccountInputModal'
import { getAction } from '@/api/manage'

export default {
  name: 'SelectPostInput',
  components: { SelectPlatformAccountInputModal },
  props: {
    dataIsolation: {
      type: String,
      required: false,
      default: ''
    },
    dataType: {
      type: String,
      required: false,
      default: ''
    },
    disabled: {
      type: Boolean,
      required: false,
      default: false
    },
    open: {
      type: Boolean,
        required: false,
        default: false
      },
      value: {
        type: String,
        required: false
      },
      multi: {
        type: Boolean,
        default: false,
        required: false
      },
      props:{
        type: Object,
        default:null,
      }
    },
    data() {
      return {
        ids: [],
        selectedObj: [],
        deleteIds: [],
        list: [],
        objs:"",
        url: {
          queryById: '/api/erp/omc/platformaccount/erpOmcPlatformAccountFinal/queryById',
          queryByIds: '/api/erp/omc/platformaccount/erpOmcPlatformAccountFinal/queryByIds',
          urlList: '/api/erp/omc/platformaccount/erpOmcPlatformAccountFinal/list2?status=2'
        },
      }
    },
    mounted() {

      //debugger;
      this.initObj(this.value);
    },
    watch: {
      value(val) {
        this.initObj(val);
      },
    },
    model: {
      prop: 'value',
      event: 'change'
    },
    methods: {
      initObj(ids) {
        console.log(ids);
        this.deleteIds = [];
        this.selectedObj = [];
        if(ids&&ids.length>0) {
          this.ids = ids.split(",");
          let url='';
          let param={};
          if(this.ids.length==1){
            url=this.url.queryById;
            param={id:ids};
          }else{
            url=this.url.queryByIds;
            param={ids:ids};
          }
          getAction(url,param).then((res)=>{
            if(res.success){
              if(!Array.isArray(res.result)){
                this.selectedObj.push(res.result);
              }else{
                for(let i=0;i<res.result.length;i++){
                  this.selectedObj.push(res.result[i]);
                }
              }
              this.$refs.inputModal.edit(res.result,this.ids);
            }
          });
        } else{
          this.ids = [];
          this.$refs.inputModal.edit(null,null);
        }

      },
      resetObj() {
        this.userType = false;
        this.ids = [];
        this.selectedObj = [];
        this.deleteIds = [];
        this.open = false;
        this.$refs.inputModal.edit(null, null);
      },
      selectIds() {
        if(!this.disabled){
          this.deleteId();
          this.$refs.inputModal.add(this.selectedObj, this.ids);
        }
      },
      deselect(value, option) {
        this.deleteIds.push(value);
        this.deleteId();
        this.choseObj(this.selectedObj);
      },
      deleteId() {
        let that = this;
        this.selectedObj = this.selectedObj.filter(function (e) {
          return that.deleteIds.indexOf(e.id) == -1;
        })
        this.deleteIds = [];
      },
      // 子modal回调
      choseObj: function (list) {
        this.selectedObj = list;
        this.ids = [];
        for (var i = 0; i < list.length; i++) {
          this.ids.push(list[i].id);
        }
        this.objs=this.ids.join(",");
        this.$emit("change", this.objs);
        this.$emit("back", this.selectedObj);
      },
    }
  }
</script>

<style scoped>

</style>